<template>
  <section>
    <!--工具条-->
    <el-col :span="24" class="toolbar">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item>
          <el-button type="success" @click="handleAdd">创建</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="warning" @click="handleUpdate" :disabled="butStatus.selectNum">修改</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="danger" @click="handleRm" :disabled="butStatus.selectNum">删除</el-button>
        </el-form-item>
      </el-form>
    </el-col>

    <!--数据列表-->
    <el-table
      :data="udfsData"
      highlight-current-row
      @selection-change="handleSelectionChange"
      border
      style="width: 100%">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column
        property="data_hive_udfs_id"
        label="ID">
        <!--width="60">-->
      </el-table-column>
      <el-table-column
        property="udf_name"
        label="Udfs名称">
        <!--width="150">-->
      </el-table-column>
      <el-table-column
        property="udf_jar_mainclass"
        label="类名">
        <!--width="150">-->
      </el-table-column>
      <el-table-column
        property="udf_jar_path"
        label="资源路径">
        <!--width="150">-->
      </el-table-column>
      <el-table-column
        property="hive_database_name"
        label="数据库">
        <!--width="100">-->
      </el-table-column>
      <el-table-column
        property="hive_udfs_type"
        label="类型">
      </el-table-column>

    </el-table>
    <!--分页-->
    <el-col :span="24" class="toolbar" style="padding-bottom:10px;">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pagination.start_index"
        :page-sizes="[5, 10, 20, 50]"
        :page-size="pagination.page_size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pagination.count"
        style="float:right"></el-pagination>
    </el-col>

    <el-dialog :title="formTitle" v-model="dialogForm" size="tiny" @close="resetForm">
      <div class="form-warn">
        <el-form :model="form" :rules="editFormRules" ref="form" :label-width="formLabelWidth">
          <el-form-item label="名称" prop="udf_name">
            <el-input  v-model="form.udf_name" auto-complete="off" :disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="类型" prop="hive_udfs_type">
            <el-select v-model="form.hive_udfs_type" placeholder="请选择类型" :disabled="disabled" style="width: 100%;">
              <el-option label="udaf" value="udaf"></el-option>
              <el-option label="udf" value="udf"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="数据库" prop="hive_database_name">
            <el-select v-model="form.hive_database_name" placeholder="请选择" :disabled="disabled" style="width: 100%;">
              <el-option v-for="item in hiveList"
                         :label="item.hive_database_name"
                         :value="item.hive_database_name"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="资源路径" prop="udf_jar_path">
            <UploadPath v-model="form.udf_jar_path"></UploadPath>
          </el-form-item>
          <el-form-item label="类名" prop="udf_jar_mainclass">
            <el-input v-model="form.udf_jar_mainclass"
                      auto-complete="off"
                      placeholder="必须输入正确的类名"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="resetForm">取 消</el-button>
        <el-button type="primary" @click="editSubmit" :loading="editLoading">{{btnEditText}}</el-button>
      </div>
    </el-dialog>
  </section>
</template>

<script>
  import util from '../../common/util'
  import dao from '../../common/dao'
  import UploadPath from '../../components/UploadPath.vue'

  export default {
    components: {UploadPath},
    data() {
      return {
        formTitle: '',
        btnEditText: "确定",
        form: {
          udf_name: '',
          hive_database_name: "",
          udf_jar_path: '',
          udf_jar_mainclass: '',
          hive_udfs_type: ''
        },
        multipleSelection: [],
        editFormRules: {
        },
        formLabelWidth: "90px",
        dialogForm: false,
        sizeChange: 1,
        formInline: {},
        butStatus: {
          selectNum: true,
        },
        udfsData: [],
        pagination: {
          count: 0,
          start_index: 1,
          page_size: 20,
        },
        hiveList: [],
        disabled:false,
      }
    },
    methods: {
      handleSizeChange (val) {
        this.pagination.page_size = val;
        this.getUdfsData();
      },
      handleCurrentChange (val) {
        this.pagination.start_index = val;
        this.getUdfsData();
      },
      handleRm(){

        this.$confirm('此操作将永久删除udfs, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let id = this.multipleSelection[0].data_hive_udfs_id || {};

          dao.udfsDelete({"data_hive_udfs_id": id}).then(res => {

            if (res.FX.err) return false;
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
            this.getUdfsData();

          });

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      handleAdd(){
        this.formTitle = '创建';
        this.disabled = false;
        this.dialogForm = true;
        this.setRules('add')
        this.getHiveListHttp();
        this.form = {
          udf_name: '',
          udfsType: '',
          hive_database_name: '',
          udf_jar_path: '',
          udf_jar_mainclass: '',
          hive_udfs_type: '',
        };
      },
      handleUpdate(){  //点击打开编辑页面
        this.formTitle = '修改';
        this.dialogForm = true;
        this.disabled =true;
        this.setRules()
        this.form = JSON.parse(JSON.stringify(this.multipleSelection[0]));
        this.form.udfsType = "";

      },
      setRules(sta){
        let _this =this;
        if(sta=="add"){
        this.editFormRules = {
          udf_name: [
            {required: true, message: '请输入名称', trigger: 'blur'},
            {validator: util.validateString, trigger: 'blur'},
            {validator: _this.validateNameAndType, trigger: 'blur'}
          ],
            hive_udfs_type: [
            {required: true, message: '请选择类型', trigger: 'change'}
          ],
            hive_database_name: [
            {required: true, message: '请选择数据库', trigger: 'change'},
            {validator: _this.validateNameAndDbName, trigger: 'blur'}
          ],
            udf_jar_path: [
            {required: true, message: '请选择资源路径', trigger: 'blur'}
          ],
            udf_jar_mainclass: [
            {required: true, message: '请输入类名', trigger: 'blur'},
            {validator: util.validateFileName, trigger: 'blur'}
          ]
        }
        }else {
          this.editFormRules = {
            udf_name: [
              {required: true, message: '请输入名称', trigger: 'blur'},
              {validator: util.validateString, trigger: 'blur'},
            ],
            hive_udfs_type: [
              {required: true, message: '请选择类型', trigger: 'change'}
            ],
            hive_database_name: [
              {required: true, message: '请选择数据库', trigger: 'change'},
            ],
            udf_jar_path: [
              {required: true, message: '请选择资源路径', trigger: 'blur'}
            ],
            udf_jar_mainclass: [
              {required: true, message: '请输入类名', trigger: 'blur'},
              {validator: util.validateFileName, trigger: 'blur'}
            ]
          }
        }

      },

      editSubmit () {
        this.$refs.form.validate((valid) => {
          if (!valid) return false;
          this.$confirm(`此操作将${this.formTitle}, 是否继续?`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {

            let fun = "";
            let f = this.form;
            let arg = {};

            if (this.formTitle == '创建') {
              fun = 'udfsAdd';
              arg = f;
            } else if (this.formTitle == '修改') {
              fun = 'udfsUpdate';
              arg = {
                data_hive_udfs_id: f.data_hive_udfs_id,
                udf_name: f.udf_name,
                hive_database_name: f.hive_database_name,
                udf_jar_path: f.udf_jar_path,
                udf_jar_mainclass: f.udf_jar_mainclass,
                hive_udfs_type: f.hive_udfs_type,
              }
            } else {
              return false;
            }
            this.editLoading = true;
            this.btnEditText = '处理中';
            dao[fun](arg).then(res => {
              this.editLoading = false;
              this.btnEditText = '确定';

              if (res.FX.err) return false;
              this.$message({
                type: 'success',
                message: `${this.formTitle}成功`
              });
              this.dialogForm = false;
              this.getUdfsData();
            }).catch(res => {
              this.editLoading = false;
              this.btnEditText = '确定';
            });

          }).catch((res) => {
            this.$message({
              type: 'info',
              message: '已取消操作'
            });
          });
        })
      },
      handleSelectionChange (val) { //选中事件
        this.multipleSelection = val;
        (val.length == 1) ? this.butStatus.selectNum = false : this.butStatus.selectNum = true
      },
      getUdfsData () {

        let start_index = this.pagination.start_index;
        let page_size = this.pagination.page_size;
        dao.udfsGet({start_index, page_size}).then(res => {
          this.pagination.count = res.body.count || 0;
          this.udfsData = res.body.results || [];
        });

      },
      getHiveListHttp () {
        dao.getHiveList({}).then((response) => {
          this.hiveList = response.body.tenant_hive || [];
        });
      },
      validateNameAndDbName (rule, value, callback) {
        if (value == '') {
          callback()
          return false
        }
        if (this.form.udf_name != '' && this.form.hive_database_name != '') {
          dao.validateNameAndDbName({
            'udf_name': this.form.udf_name,
            'hive_database_name': this.form.hive_database_name
          }).then((response) => {
            let parms = response.body || {};
            if (parms.retMsg == 0) {
              callback(new Error('名称和数据库结合唯一！'))
            } else {
              callback();
            }
          })
        } else {
          callback()
        }
      },
      resetForm () { //重置表单
        this.$refs.form.resetFields();
        this.dialogForm = false;
      }
    },
    mounted () {
      this.getUdfsData();
      this.getHiveListHttp();
    }
  }
</script>

<style scoped>

</style>